<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Insert title here</title>
</head>
<body>
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.bootcss.com/sockjs-client/1.1.1/sockjs.js"></script>
<script type="text/javascript">


    var websocket = null;
    if ('WebSocket' in window) {
        websocket = new WebSocket("ws://"+window.location.hostname+":8080/websocket/socketServer");
    }
    else if ('MozWebSocket' in window) {
        websocket = new MozWebSocket("ws://"+window.location.hostname+":8080/websocket/socketServer");
    }
    else {
        websocket = new SockJS("http://"+window.location.hostname+":8080/sockjs/socketServer");
    }
    websocket.onopen = onOpen;
    websocket.onmessage = onMessage;
    websocket.onerror = onError;
    websocket.onclose = onClose;

    function onOpen(openEvt) {
        alert("连接成功");
    }

    function onMessage(evt) {
        alert("onMessage：" + evt.data);
    }
    function onError() {}
    function onClose() {}

    function doSend() {
        if (websocket.readyState == websocket.OPEN) {
            var msg = document.getElementById("inputMsg").value;
            var user = document.getElementById("inputUser").value;
            websocket.send(user + ":" + msg);//调用后台handleTextMessage方法
            alert("发送成功!");
        } else {
            alert("连接失败!");
        }
    }

    window.close=function()
    {
        websocket.onclose();
    }


</script>
目标用户：<input type="text" id="inputUser" name="inputUser" /><br />
内容：<br />
<textarea rows="5" cols="50" id="inputMsg" name="inputMsg"></textarea><br />
<button onclick="doSend();">发送</button>
</body>
</html>